var backTopEl = document.querySelector(".backTop");
var backTopImg = backTopEl.querySelector("img");

//当鼠标移动到图片上时，让图片变成一个gif
backTopImg.onmouseenter = function() {
        //this.setAttribute("src", "images/rockets.gif");
        this.src = "images/rockets.gif"
    }
    //当鼠标移出图片时，让图片变成一个png
backTopImg.onmouseleave = function() {
        this.src = "images/rockets.png"
    }
    //监听浏览器滚动条
window.onscroll = function() {
    //如果页面向下移动了600
    if (pageYOffset >= 600) {
        //显示回到顶部的元素
        backTopEl.style.display = "block"
    } else {
        //否则隐藏回到顶部的元素
        backTopEl.style.display = "none"
    }
}

//固定速度回到顶部函数
function backToTop() {
    //设置速度即每次移动的距离
    var speed = 50;
    //设置一个定时器，每50ms执行一次回调函数
    var timer = setInterval(function() {
        //每次向上移动speed的值
        scrollBy(0, -speed);
        //判断页面是否达到顶端
        if (window.pageYOffset <= 0) {
            //如果到达顶端取消定时器
            clearInterval(timer);
            //结束函数
            return
        }
    }, 50)
}
//固定时间回到顶部函数
function backToTop1() {
    var posY = pageYOffset;
    var totalTime = 500;
    var y = posY / totalTime * 20;
    var timer = setInterval(function() {
        if (pageYOffset <= 0) {
            clearInterval(timer)
            return
        }
        scrollBy(0, -y)
    }, 20)
}
//给图片点击绑定backtoTop函数
backTopImg.onclick = backToTop1